import { useSelector, useDispatch } from "react-redux";
// import { changeNum } from "./store/modules/countStore";
import { fetchChannelList } from "./store/modules/channelStore";
import { useEffect } from "react";

function App() {
  //使用useSelector函数获取模块的状态值
  const {channelList}=useSelector(state=>state.channel)
  // const { count } = useSelector(state => state.counter)
  //使用useDispatch函数用于调用改变状态值的actions方法
  const dispatch = useDispatch()
  useEffect(()=>{
    //使用redux中的异步方法
    dispatch(fetchChannelList())
  },[dispatch])
  return (
    <div className="App">
      {/* <button onClick={() => dispatch(reduce())}>-</button>
      {count}
      <button onClick={() => dispatch(add())}>+</button> */}
      {/* //actions传参 */}
      {/* <button onClick={()=>dispatch(changeNum(888))}>{count}</button> */}
      <ul>
        {channelList.map(item=><li key={item.id}>{item.name}</li>)}
      </ul>
    </div>
  );
}

export default App;
